<template>
  <div>
    <div
      class="ww"
      style="color: #101010; font-weight: 600; margin-bottom: 20px"
    >
      导出数据
    </div>
    <!-- 顶部按钮 -->

    <div class="export_top_box">
      <div class="export_top_left">
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
          <el-tab-pane
            :label="item.label"
            :name="item.name"
            :key="item.name"
            v-for="item in tabTopList"
          ></el-tab-pane>
        </el-tabs>
      </div>
      <el-button type="primary" class="exportStatBtn" @click="exportStatFun"
        >埋点数据导出</el-button
      >
    </div>
    <!-- 中间搜索层 -->
    <div class="export_mid_box">
      <el-input
        v-model="inputKeyWord"
        placeholder="请输入奖品名称"
        class="statKeyWords"
        clearable
      ></el-input>
      <el-input
        v-model="inputPhoneNum"
        placeholder="请输入完整注册手机号"
        class="userPhoneNum"
        clearable
        min="0"
        oninput="value=value.replace(/[^0-9.]/g,'')"
      ></el-input>
      <el-button type="primary" class="checkKeyBtn" @click="searchKey(1)"
        >查询</el-button
      >
      <el-date-picker
        v-model="timeList"
        type="datetimerange"
        value-format="yyyy-MM-dd HH:mm:ss"
        range-separator="-"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
      >
      </el-date-picker>

      <el-select
        size="small"
        class="commodShopSelect1"
        clearable
        style="width: 17%"
        v-model="prizeTypeValue"
        placeholder="请选择奖品类型"
      >
        <el-option
          v-for="(item, index) in prizeData"
          :key="index"
          :label="item.label"
          :value="item.status"
        ></el-option>
      </el-select>

      <el-select
        size="small"
        class="commodShopSelect2"
        clearable
        style="width: 17%"
        v-model="goodsStatus"
        placeholder="请选择发货状态"
      >
        <el-option
          v-for="(item, index) in orderData"
          :key="index"
          :label="item.label"
          :value="item.status"
        ></el-option>
      </el-select>

      <el-button type="primary" class="exportBtn" @click="showBounced"
        >导出</el-button
      >
    </div>
    <!-- 底部列表层 -->
    <div class="export_bot_box" style="margin-left: 0%; margin-top: 15px">
      <el-table :data="prizeOrChangeInfo" style="width: 100%" align="center">
        <el-table-column
          label="ID"
          type="index"
          :index="indexMethod"
          align="center"
        />
        <el-table-column
          prop="prizeName"
          label="奖品名称"
          width
          align="center"
        ></el-table-column>
        <el-table-column
          prop="registerPhone"
          label="注册手机号"
          width
          align="center"
        ></el-table-column>
        <el-table-column prop="prizeType" label="类型" width align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.prizeType == 1">实体奖</span>
            <span v-if="scope.row.prizeType == 3">优惠券</span>
            <span v-if="scope.row.prizeType == 4">积分奖</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="addTime"
          :label="activeName == '1' ? '兑换时间' : '中奖时间'"
          width="190"
          align="center"
        >
        </el-table-column>
        <!-- <el-table-column prop="prizeStatus" label="发货状态" width align="center">
          <template slot-scope="scope">
            <span v-if="!scope.row.prizeStatus">已发货</span>
            <span v-if="scope.row.prizeStatus">去发货</span>
          </template>
        </el-table-column> -->
        <el-table-column
          prop="logisticsStatus"
          label="发货状态"
          width
          align="center"
        ></el-table-column>
        <el-table-column prop="isConfirm" label="填写地址" width align="center">
          <template slot-scope="scope">
            <span v-if="!scope.row.isConfirm">未填写</span>
            <span v-if="scope.row.isConfirm">已填写</span>
          </template>
        </el-table-column>
        <el-table-column prop label="操作" align="center">
          <template slot-scope="scope">
            <el-button
              type="primary"
              v-if="scope.row.showLogisticsStatus == 'SHIP_NO'"
              size="small"
              @click="finishSendBtnFun(scope.row.id)"
              >去发货
            </el-button>
            <el-button
              type="danger"
              v-if="scope.row.showLogisticsStatus == 'SHIP_FINISH'"
              size="small"
              @click="waitSendBtnFun(scope.row.id)"
              >已发货
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="block" style="margin-top: 20px; margin-bottom: 50px">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNum"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pageTotalNum"
        background
        v-if="pageTotalNum != 0"
      ></el-pagination>
    </div>

    <!-- 弹窗页面部分 :show-close="false"-->
    <el-dialog
      :visible.sync="dialogFormVisible"
      title="埋点数据导出"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      @close="closeDialog"
    >
      <!-- 编辑店铺的弹窗 -->
      <div>
        <el-form label-width="100px" class="demo-ruleForm">
          <el-form-item label="导出时间段">
            <el-date-picker
              prefix-icon="el-icon-date"
              v-model="exportTimeList"
              type="daterange"
              value-format="yyyy-MM-dd HH:mm:ss"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="exportSelfStat">导出</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import https from "../../../http";
export default {
  data() {
    return {
      inputKeyWord: "", //奖品名称
      inputPhoneNum: "", //手机号码
      activeName: "1",
      pageNum: 1, //前往多少页
      pageSize: 10, //每页有多少条数据
      pageTotalNum: 0, //总条数
      prizeTypeValue: "", //选择的奖品的类型
      goodsStatus: "", //物流的状态
      timeList: [], //时间的选择       //查询部分
      exportTimeList: [], //导出部分的时间选择
      dialogFormVisible: false,
      tabTopList: [
        {
          name: "1",
          label: "兑换数据",
        },
        {
          name: "2",
          label: "中奖数据",
        },
      ],
      token: "",
      prizeData: [
        {
          label: "实体奖",
          status: "1",
        },
        {
          label: "优惠券",
          status: "3",
        },
        {
          label: "积分奖",
          status: "4",
        },
      ],
      orderData: [
        {
          label: "未发货",
          status: "1",
        },
        {
          label: "已发货",
          status: "2",
        },
      ],
      prizeOrChangeInfo: [
        // {
        //   prizeName: "奖品A",
        //   prizePhone: "AAA",
        //   prizeType: 1,
        //   prizeTime: "2021-09-05 11:00:00",
        //   prizeStatus: 0,
        //   prizeAddress: 0,
        // },
        // {
        //   prizeName: "奖品B",
        //   prizePhone: "BBB",
        //   prizeType: 1,
        //   prizeTime: "2021-09-05 11:00:00",
        //   prizeStatus: 0,
        //   prizeAddress: 0,
        // },
      ],
    };
  },
  created() {
    let naid = sessionStorage.getItem("authorization");
    console.log("======================naid", naid);
    if (naid) {
      this.token = naid;
    } else {
      this.token =
        "eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOjEsImxhc3RMb2dpblRpbWUiOjE2NTk1MTQxNDcyMTksImxvZ2luSWQiOiJzeXNBZG1pbiIsImNyZWF0ZWQiOjE2NTk1MTQxNDcyMTksInVzZXJOYW1lIjoic3lzQWRtaW4iLCJleHAiOjE2NjAxMTg5NDcsIm9yZ0lkIjo5NTUyfQ.MPoLoNnNbde8PddID_aSRJg1johmo9tGnHbS3okvPm8HMROh09-DwxG_vkQJCqSlQgjgStuHzojMMJEear-xUw";
    }
  },
  mounted() {
    this.getExchangeList1();
  },
  methods: {
    indexMethod(index) {
      return (this.pageNum - 1) * this.pageSize + index + 1;
    },
    //关闭弹窗
    closeDialog() {
      // this.dialogFormVisible = false;
      this.exportTimeList = [];
    },
    handleClick(targetName) {
      let that = this;
      console.log("点击的是哪个", targetName.name);
      that.timeList = [];

      that.inputKeyWord = "";
      that.inputPhoneNum = "";
      that.prizeTypeValue = "";
      that.goodsStatus = "";
      that.pageNum = 1;
      that.pageSize = 10;
      that.prizeOrChangeInfo = [];
      if (targetName.name == "1") {
        //点击的兑换数据
        this.getExchangeList1();
      } else if (targetName.name == "2") {
        //点击的是中奖数据
        this.getPrizeList1();
      }
    },
    //点击已发货按钮
    finishSendBtnFun(id) {
      console.log("点击已发货按钮", id);
      this.$confirm("是否确认发货?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.finishSendFun(id);
          // this.$message({
          //   type: 'success',
          //   message: '删除成功!'
          // });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消确认发货",
          });
        });
    },
    //点击已发货按钮
    finishSendFun(id) {
      console.log("点击已发货按钮", id);
      let that = this;
      let arr = [];
      arr[0] = {
        id: id,
        logisticsStatus: "SHIP_FINISH",
      };
      console.log("点击已发货回复就回家", arr);
      https
        .fetchPost(
          "/api/v2.1/record/pepsi/management/prize/logistics/update",
          arr,
          {
            headers: {
              token: that.token,
            },
          }
        )
        .then((data) => {
          console.log("===修改已发货状态成功", data);
          console.log("2111111111111111111111111111");
          if (data.status == 200 && data.data.success) {
            that.$message({
              type: "success",
              message: "确认发货成功!",
            });
            // that.prizeOrChangeInfo = data.data.data.aaData;
            // that.pageTotalNum = data.data.data.iTotalDisplayRecords;
            if (that.activeName == "1") {
              //点击的兑换数据
              that.getExchangeList();
            } else if (that.activeName == "2") {
              //点击的是中奖数据
              that.getPrizeList();
            }
          }
        })
        .catch((err) => {
          console.log("修改已发货状态失败", err);
        });
    },
    //点击待发货按钮
    waitSendBtnFun(id) {
      console.log("点击已发货按钮", id);
      this.$confirm("是否取消发货?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.waitSendFun(id);
          // this.$message({
          //   type: 'success',
          //   message: '删除成功!'
          // });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消取消发货",
          });
        });
    },
    //点击待发货按钮
    waitSendFun(id) {
      console.log("点击待发货按钮", id);
      let that = this;
      let arr = [];
      arr[0] = {
        id: id,
        logisticsStatus: "SHIP_NO",
      };
      https
        .fetchPost(
          "/api/v2.1/record/pepsi/management/prize/logistics/update",
          arr,
          {
            headers: {
              token: that.token,
            },
          }
        )
        .then((data) => {
          console.log("===修改待发货状态成功", data);
          console.log("2111111111111111111111111111");
          if (data.status == 200 && data.data.success) {
            that.$message({
              type: "success",
              message: "取消发货成功!",
            });
            if (that.activeName == "1") {
              //点击的兑换数据
              that.getExchangeList();
            } else if (that.activeName == "2") {
              //点击的是中奖数据
              that.getPrizeList();
            }
          }
        })
        .catch((err) => {
          console.log("修改待发货状态失败", err);
        });
    },
    changeTime() {},
    //点击查询
    searchKey(index) {
      console.log(
        "点击查询",
        this.prizeTypeValue,
        this.goodsStatus,
        this.timeList,
        index
      );
      console.log(
        "$$$$$$$$$$$  this.activeName == ",
        this.activeName,
        this.page
      );
      if (index == 1) {
        this.pageNum = 1;
      }
      if (this.activeName == "1") {
        //点击的兑换数据
        this.getExchangeList();
      } else if (this.activeName == "2") {
        //点击的是中奖数据
        this.getPrizeList();
      }
    },
    //点击导出
    showBounced() {
      this.$message.closeAll();
      this.$message.info("导出中，请稍后~");
      console.log("点击导出", this.activeName);
      if (this.activeName == "1") {
        this.exportExchangeData();
      } else if (this.activeName == "2") {
        this.exportPrizeData();
      }
    },
    //导出兑换数据
    async exportExchangeData() {
      let that = this;
      let token = that.token;
      // let fileXlsName = new Date().getTime();
      let fileXlsName = await that.getNowTime();
      return new Promise((resolve, reject) => {
        let data = {};
        console.log("=======================data", that.timeList);
        if (that.timeList && that.timeList.length > 1) {
          data.startExchangeTime = that.timeList[0];
          data.endExchangeTime = that.timeList[1];
        }
        console.log("=======================data22", that.timeList);
        data.prizeName = that.inputKeyWord; //奖品名称
        data.mobile = that.inputPhoneNum; //手机号码
        data.prizeType = that.prizeTypeValue; //奖品类型 1 实物奖品 3优惠券 4 积分奖
        data.fullStatus = that.goodsStatus; //物流状态 1 未发货 2 去发货
        let fileurl = `${uploadUrl}/api/v2.1/record/pepsi/management/export/exchange`;
        var xhr = new XMLHttpRequest();
        xhr.open("POST", fileurl, true);
        xhr.responseType = "blob";
        xhr.setRequestHeader("token", token);
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.onload = function () {
          if (this.status == 200) {
            var blob = this.response;
            var downloadElement = document.createElement("a");
            var href = window.URL.createObjectURL(blob);
            downloadElement.href = href;
            downloadElement.download = `兑换数据_${fileXlsName}.xls`;
            document.body.appendChild(downloadElement);
            downloadElement.click();
            document.body.removeChild(downloadElement);
            window.URL.revokeObjectURL(href);
            resolve(true);
          } else {
            this.$message.closeAll();
            this.$message.info("导出失败~");
            resolve(false);
          }
        };
        console.log("下载下载data", JSON.stringify(data));
        xhr.send(JSON.stringify(data));
      });
    },
    //导出中奖数据
    async exportPrizeData() {
      let that = this;
      let token = that.token;
      // let fileXlsName = new Date().getTime();
      let fileXlsName = await that.getNowTime();
      return new Promise((resolve, reject) => {
        // console.log(query_str);
        let data = {};
        if (that.timeList && that.timeList.length > 1) {
          data.startExchangeTime = that.timeList[0];
          data.endExchangeTime = that.timeList[1];
        }
        console.log("=======================data22", that.timeList);
        data.prizeName = that.inputKeyWord; //奖品名称
        data.mobile = that.inputPhoneNum; //手机号码
        data.prizeType = that.prizeTypeValue; //奖品类型 1 实物奖品 3优惠券 4 积分奖
        data.fullStatus = that.goodsStatus; //物流状态 1 未发货 2 去发货
        // if (that.pushed != 3) {
        //   data.pushed = that.pushed
        // }

        let fileurl = `${uploadUrl}/api/v2.1/record/pepsi/management/export/lucky`;
        var xhr = new XMLHttpRequest();
        xhr.open("POST", fileurl, true);
        xhr.responseType = "blob";
        xhr.setRequestHeader("token", token);
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.onload = function () {
          if (this.status == 200) {
            var blob = this.response;
            var downloadElement = document.createElement("a");
            var href = window.URL.createObjectURL(blob);
            downloadElement.href = href;
            downloadElement.download = `中奖数据_${fileXlsName}.xls`;
            document.body.appendChild(downloadElement);
            downloadElement.click();
            document.body.removeChild(downloadElement);
            window.URL.revokeObjectURL(href);
            resolve(true);
          } else {
            this.$message.closeAll();
            this.$message.info("导出失败~");
            resolve(false);
          }
        };
        xhr.send(JSON.stringify(data));
      });
    },
    // 获取查询中奖数据列表
    getPrizeList() {
      let that = this;
      let obj = {};
      if (that.timeList && that.timeList.length > 1) {
        obj.startExchangeTime = that.timeList[0];
        obj.endExchangeTime = that.timeList[1];
      }
      obj.prizeName = that.inputKeyWord; //奖品名称
      obj.mobile = that.inputPhoneNum; //手机号码
      obj.prizeType = that.prizeTypeValue; //奖品类型 1 实物奖品 3优惠券 4 积分奖
      obj.fullStatus = that.goodsStatus; //物流状态 1 未发货 2 去发货
      obj.page = that.pageNum; //分页页码
      obj.pageSize = that.pageSize; //页面大小
      https
        .fetchPost("/api/v2.1/record/pepsi/management/export/prize/list", obj, {
          headers: {
            token: that.token,
          },
        })
        .then((data) => {
          console.log("===获取中奖数据列表", data);
          if (data.status == 200 && data.data.success) {
            that.prizeOrChangeInfo = data.data.data.aaData;
            that.pageTotalNum = data.data.data.iTotalDisplayRecords;
          } else {
            this.$message({
              message: "获取中奖数据列表错误",
              type: "warning",
            });
          }
        })
        .catch((err) => {
          console.log("获取中奖数据列表错误", err);
          this.$message({
            message: "获取中奖数据列表错误",
            type: "warning",
          });
        });
    },
    // 获取中奖数据列表
    getPrizeList1() {
      let that = this;
      let obj = {};
      if (that.timeList && that.timeList.length > 1) {
        obj.startExchangeTime = that.timeList[0];
        obj.endExchangeTime = that.timeList[1];
      }
      obj.prizeName = that.inputKeyWord; //奖品名称
      obj.mobile = that.inputPhoneNum; //手机号码
      obj.prizeType = that.prizeData[0].status;
      obj.fullStatus = that.goodsStatus; //物流状态 1 未发货 2 去发货
      obj.page = that.pageNum; //分页页码
      obj.pageSize = that.pageSize; //页面大小
      https
        .fetchPost("/api/v2.1/record/pepsi/management/export/prize/list", obj, {
          headers: {
            token: that.token,
          },
        })
        .then((data) => {
          console.log("===获取中奖数据列表", data);
          if (data.status == 200 && data.data.success) {
            that.prizeOrChangeInfo = data.data.data.aaData;
            that.pageTotalNum = data.data.data.iTotalDisplayRecords;
          } else {
            this.$message({
              message: "获取中奖数据列表错误",
              type: "warning",
            });
          }
        })
        .catch((err) => {
          console.log("获取中奖数据列表错误", err);
          this.$message({
            message: "获取中奖数据列表错误",
            type: "warning",
          });
        });
    },
    // 获取查询兑换数据列表
    getExchangeList() {
      let that = this;
      let obj = {};
      if (that.timeList && that.timeList.length) {
        obj.startExchangeTime = that.timeList[0];
        obj.endExchangeTime = that.timeList[1];
      }
      obj.prizeName = that.inputKeyWord; //奖品名称
      obj.mobile = that.inputPhoneNum; //手机号码
      obj.prizeType = that.prizeTypeValue; //奖品类型 1 实物奖品 3优惠券 4 积分奖
      obj.fullStatus = that.goodsStatus; //物流状态 1 未发货 2 去发货
      obj.page = that.pageNum; //分页页码
      obj.pageSize = that.pageSize; //页面大小
      that.pageTotalNum = 0;
      // console.log("=======that.timeList.length=========",that.timeList.length)

      https
        .fetchPost(
          "/api/v2.1/record/pepsi/management/export/exchange/list",
          obj,
          {
            headers: {
              token: that.token,
            },
          }
        )
        .then((data) => {
          console.log("===获取兑换数据列表1", data);
          console.log("2111111111111111111111111111", that.pageNum);
          if (data.status == 200 && data.data.success) {
            that.prizeOrChangeInfo = data.data.data.aaData;
            that.pageTotalNum = data.data.data.iTotalDisplayRecords;
          } else {
            this.$message({
              message: "获取兑换数据列表错误",
              type: "warning",
            });
          }
        })
        .catch((err) => {
          console.log("获取兑换数据列表错误", err);
          this.$message({
            message: "获取兑换数据列表错误",
            type: "warning",
          });
        });
    },
    // 获取兑换数据列表
    getExchangeList1() {
      let that = this;
      let obj = {};
      if (that.timeList && that.timeList.length) {
        obj.startExchangeTime = that.timeList[0];
        obj.endExchangeTime = that.timeList[1];
      }
      obj.prizeName = that.inputKeyWord; //奖品名称
      obj.mobile = that.inputPhoneNum; //手机号码
      obj.prizeType = that.prizeData[0].status; // 奖品类型  实体奖
      obj.fullStatus = that.goodsStatus; //物流状态 1 未发货 2 去发货
      obj.page = that.pageNum; //分页页码
      obj.pageSize = that.pageSize; //页面大小
      that.pageTotalNum = 0;
      https
        .fetchPost(
          "/api/v2.1/record/pepsi/management/export/exchange/list",
          obj,
          {
            headers: {
              token: that.token,
            },
          }
        )
        .then((data) => {
          console.log("===获取兑换数据列表1", data);
          console.log("2111111111111111111111111111");
          if (data.status == 200 && data.data.success) {
            that.prizeOrChangeInfo = data.data.data.aaData;
            that.pageTotalNum = data.data.data.iTotalDisplayRecords;
          } else {
            this.$message({
              message: "获取兑换数据列表错误",
              type: "warning",
            });
          }
        })
        .catch((err) => {
          console.log("获取兑换数据列表错误", err);
          this.$message({
            message: "获取兑换数据列表错误",
            type: "warning",
          });
        });
    },
    //点击埋点数据导出的按钮
    exportStatFun() {
      this.dialogFormVisible = true;
    },

    // 获取当前时间
    getNowTime() {
      const yy = new Date().getFullYear();
      const MM =
        new Date().getMonth() + 1 < 10
          ? "0" + (new Date().getMonth() + 1)
          : new Date().getMonth() + 1;
      const dd =
        new Date().getDate() < 10
          ? "0" + new Date().getDate()
          : new Date().getDate();
      const HH =
        new Date().getHours() < 10
          ? "0" + new Date().getHours()
          : new Date().getHours();
      const mm =
        new Date().getMinutes() < 10
          ? "0" + new Date().getMinutes()
          : new Date().getMinutes();
      const ss =
        new Date().getSeconds() < 10
          ? "0" + new Date().getSeconds()
          : new Date().getSeconds();
      return yy + "-" + MM + "-" + dd + " " + HH + "-" + mm + "-" + ss;
    },
    //点击埋点数据导出
    async exportSelfStat() {
      let that = this;
      let token = that.token;
      // let fileXlsName = new Date().getTime();
      let fileXlsName = await that.getNowTime();
      // console.log("埋点导出",name);
      return new Promise((resolve, reject) => {
        // console.log(query_str);
        let obj = {};
        if (that.exportTimeList && that.exportTimeList.length > 1) {
          obj.startTime = that.exportTimeList[0];
          obj.endTime = that.exportTimeList[1];
          obj.fileName = fileXlsName;
          console.log("===========that.timeList2=============", obj);
        } else {
          this.$message({
            message: "请选择导出时间范围",
            type: "warning",
          });
          return;
        }
        console.log("===========that.timeList2=3============", obj);
        // if (that.pushed != 3) {
        //   data.pushed = that.pushed
        // }
        that.$message.closeAll();
        that.$message.info("导出中，请稍后~");
        let fileurl = `${uploadUrl}/api/v2.1/pepsi/report/export.xls`;
        var xhr = new XMLHttpRequest();
        xhr.open("POST", fileurl, true);
        xhr.responseType = "blob";
        xhr.setRequestHeader("token", token);
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.onload = function () {
          if (this.status == 200) {
            var blob = this.response;
            var downloadElement = document.createElement("a");
            var href = window.URL.createObjectURL(blob);
            downloadElement.href = href;
            downloadElement.download = `埋点数据_${fileXlsName}.xls`;
            document.body.appendChild(downloadElement);
            downloadElement.click();
            document.body.removeChild(downloadElement);
            window.URL.revokeObjectURL(href);
            resolve(true);
          } else {
            resolve(false);
          }
        };
        xhr.send(JSON.stringify(obj));
      });
    },
    //改变分页的每页数目
    handleSizeChange(val) {
      let that = this;
      that.pageSize = val;
      console.log(`每页 ${that.pageSize} 条`);
      that.searchKey(2);
    },
    //当前页
    handleCurrentChange(val) {
      let that = this;
      that.pageNum = val;
      console.log(`当前页: ${that.pageNum}`);
      that.searchKey(2);
      // if (this.activeName == "1") {
      //   //点击的兑换数据
      //   this.getExchangeList();
      // } else if (this.activeName == "2") {
      //   //点击的是中奖数据
      //   this.getPrizeList();
      // }
    },
  },
};
</script>

<style>
.ww {
  height: 100%;
}

.el-tabs--card > .el-tabs__header {
  border: none;
  margin: 0;
}

.el-tabs__nav-wrap is-top,
.el-tabs__nav-scroll {
  background: white !important;
  padding: 10px !important;
}

.el-tabs--card > .el-tabs__header .el-tabs__nav {
  /* border: none; */
  border-bottom: 1px solid #e4e7ed !important;
}

.el-tabs__item.is-active {
  border: 1px solid #409eff !important;
}

.export_top_box {
  width: 100%;
  background: #fff;
  /* height: 80px; */
  position: relative;
}

.exportStatBtn {
  position: absolute;
  /* float: right;
  margin-top: 10px;
  margin-right: 30px; */
  top: 10px;
  right: 30px;
}

/* 中间搜索部分 */
.export_mid_box {
  width: 100%;
  background: #fff;
  height: 120px;
  margin-top: 15px;
  padding-top: 20px;
  position: relative;
}

.statKeyWords {
  width: 17%;
  /* height: 30px; */
  /* margin: 0 30px 0 10px; */
  /* margin-right: 1%; */
  margin-left: 1%;
}

.userPhoneNum {
  width: 17%;
  /* height: 30px; */
  /* margin: 0 30px 0 0px; */
  /* margin-right: 1%; */
  margin-left: 1.5%;
}

.checkKeyBtn {
  margin-right: 30px;
  margin-left: 30px;
}

.commodShopSelect1 {
  height: 40px;
  position: absolute;
  top: 80px;
  left: 1%;
}

.commodShopSelect2 {
  height: 40px;
  position: absolute;
  top: 80px;
  left: 19.5%;
}

.el-input--small .el-input__inner {
  height: 40px !important;
  line-height: 40px !important;
}

.exportBtn {
  position: absolute;
  top: 10px;
  right: 100px;
}

/* 底部列表部分 */
.export_bot_box {
  width: 100%;
}
</style>